<template>
  <div class="song">
    <CommonHeader :data="bannersData" :title="title" :isMain="isMain"/>
    <SongMusic :songplay="songplay" />
    <SongTravels :songconte="songconte"/>
    <SongEvaluate :songconte="songconte" />
    <SongOther :songconte="songconte" />

  </div>
</template>

<script>
	import CommonHeader from "@/components/CommonHeader"
	import SongMusic from "@/components/SongView/SongMusic"
	import SongTravels from "@/components/SongView/SongTravels"
  import SongEvaluate from "@/components/SongView/SongEvaluate"
  import SongOther from "@/components/SongView/SongOther"
  
export default {
  name: 'Song',
  data(){
    return{
    	bannersData:[],
      songplay:{},
      songconte:{},
      title:"发布",
      isMain:true

    }
  },
  components:{
  	CommonHeader,
  	SongMusic,
  	SongTravels,
    SongEvaluate,
    SongOther
  },
  mounted(){
    this.$axios.get(this.HOST + "/api/songplay")
    .then(res =>{
      this.songplay = res.data.songPlay
      // console.log(this.songplay)
    })
    .catch(error =>{
      console.log(error)
    })

    this.$axios.get(this.HOST + "/api/songcon")
    .then(res =>{
      this.songconte = res.data
      console.log(res.data)
    })
    .catch(error =>{
      console.log(error)
    })

  }
}
</script>

<style lang="css" scoped>

</style>